import { CzmPoint, CzmPolyline, ESCesiumViewer } from "@czmSrc/index";
import { ESJVector4D } from "earthsdk3";
import { Destroyable, extendClassProps, reactArray, ReactivePropsToNativePropsAndChanged, reactPositions, SceneObjectKey, track } from "xbsj-base";

// 缩放轴暂时通过点和线段组合而成
export class GeoScale extends Destroyable {
    static defaults = {
        positions: [[0, 0, 0], [0, 0, 1000000]] as [number, number, number][],
    }
    get startPosition() { return this.positions && this.positions[0] as [number, number, number]; }
    set startPosition(value: [number, number, number] | undefined) {
        this.positions = [value ?? GeoScale.defaults.positions[0], this.stopPosition ?? GeoScale.defaults.positions[1]];
    }
    get startPositionChanged() { return this.positionsChanged; }

    get stopPosition() { return this.positions && this.positions[1] as [number, number, number]; }
    set stopPosition(value: [number, number, number] | undefined) {
        this.positions = [this.startPosition ?? GeoScale.defaults.positions[0], value ?? GeoScale.defaults.positions[1]];
    }
    get stopPositionChanged() { return this.positionsChanged; }

    constructor(czmViewer: ESCesiumViewer, id?: SceneObjectKey) {
        super();
        const viewer = czmViewer.viewer;
        if (!viewer) return;
        const polyline = this.ad(new CzmPolyline(czmViewer, id));
        polyline.arcType = 'RHUMB';
        const point = this.ad(new CzmPoint(czmViewer, id));
        {
            this.ad(track([polyline, 'allowPicking'], [this, 'allowPicking']));
            this.ad(track([point, 'allowPicking'], [this, 'allowPicking']));
        }
        {
            const update = () => {
                polyline.show = point.show = this.show;
            }
            update();
            this.ad(this.showChanged.don(update));
        }
        {
            const update = () => {
                polyline.width = this.width / 2;
                point.pixelSize = this.width;
            }
            update();
            this.ad(this.widthChanged.don(update));
        }
        {
            const update = () => {
                polyline.color = point.color = this.color;
            }
            update();
            this.ad(this.colorChanged.don(update));
        }
        {
            const updateProp = () => {
                polyline.positions = this.positions;
                point.position = this.stopPosition;
            };
            updateProp();
            this.dispose(this.startPositionChanged.disposableOn(updateProp));
            this.dispose(this.stopPositionChanged.disposableOn(updateProp));
        }
    }
}
export namespace GeoScale {
    export const createDefaultProps = () => ({
        show: true,
        allowPicking: false,
        positions: reactPositions(GeoScale.defaults.positions),
        width: 10,
        color: reactArray<ESJVector4D>([1, 0, 0, 1]),
    })
}
extendClassProps(GeoScale.prototype, GeoScale.createDefaultProps);
export interface GeoScale extends ReactivePropsToNativePropsAndChanged<ReturnType<typeof GeoScale.createDefaultProps>> { }